<template>
    <div class="index">
        <div class="wrapper clear">
            <div class="content">
                <router-view/>
            </div>
        </div>
        <div class="footer">
            <ul class="div_ul">
                <router-link :to="{path:'/index/found'}"><li class="div_li">首页</li></router-link>
                <router-link :to="{path:'/index/post'}"><li class="div_li">发帖</li></router-link>
                <router-link :to="{path:'/index/msg'}"><li class="div_li">消息</li></router-link>
                <router-link :to="{path:'/index/mine'}"><li class="div_li">我</li></router-link>
            </ul>
        </div>
    </div>
</template>
<script>
export default {
    name: 'home'
}
</script>

<style scoped lang="less">
@import '../../style/mixin.less';
.index {
    height: 100%;
    width: 100%;
    overflow: auto;
    .wrapper {
        background: #fff;
        min-height: 100%;
        .content {
            padding-bottom: 50px;
        }
    }
    .footer {
        position:relative;
        height:50px;
        margin:-50px auto 0 auto;//注意magin-top为负值
        clear:both;
        background:#ddd;
        .div_ul {
            margin: 0;
            padding: 0;
            list-style-type: none;
            font-size: 0;
            text-align: left;
            .div_li {
                display: inline-block;
                margin: 0;
                padding: 0;
                height: 50px;
                line-height: 50px;
                width: 25%;
                text-align: center;
                border-right: 1px solid #ccc
            }
        }
    }
}

</style>
